<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page isELIgnored="false"%>
<link href="<c:url value="/resources/bootstrap/2.3.2/css/bootstrap.css" />" rel="stylesheet">
<link href="<c:url value="/resources/bootstrap/2.3.2/css/bootstrap-responsive.css" />" rel="stylesheet">

<title>模拟客户端上传图片</title>
<style>
 	input[type='text'],input[type='password']{
		height: auto;
    }

</style>
</head>

<body>
	<div class="container-fluid">
		<div class="row-fluid">
			<h2>上传图片</h2>
			<hr>
			<div>
				<label>宽度：</label><input type="text" value="0" name="width" id="width">
			</div>
			<div>
				<label>高度：</label><input type="text" value="0" name="height" id="height">
			</div>
			<div>
				
				<input type="file" name="file" id="image" value="">
			</div>
			<div>
			<button type="button" id="saveBtn" class="btn btn-success">上传</button>
			</div>
		</div>
	</div>
	<!--/row-->
</body>

<script src="<c:url value="/resources/jquery/1.9.1/jquery.min.js" />"></script>
<script src="<c:url value="/resources/bootstrap/2.3.2/js/bootstrap.min.js" />"></script>
<script type="text/javascript" src="<c:url value="/resources/bootstrap/bootstrap-validation.js" />"></script>
<script src="<c:url value="/resources/jquery/ajaxfileupload.js" />"></script>
<script type="text/javascript">
	$(document).ready(function(){
	
		/*
		$("#saveBtn").click(function(){
			$.ajaxFileUpload({
				url:'<c:url value="/api/func/image"/>',//用于文件上传的服务器端请求地址
				secureuri:false,//一般设置为false
				fileElementId:'image',//文件上传空间的id属性  <input type="file" id="file" name="file" />
				dataType: 'JSON',//返回值类型 一般设置为json(大写)
				success: function (data, status){
					console.log(data);
				},
				error: function (data, status, e){
					alert(e);
				}
			})
		})
		*/
		$("#saveBtn").click(function(){
			$.ajaxFileUpload({
				//url:'<c:url value="/api/user/header"/>',//用于文件上传的服务器端请求地址
				url:'<c:url value="/api/func/image"/>',//用于文件上传的服务器端请求地址
				//url:'<c:url value="/api/image"/>',//用于文件上传的服务器端请求地址
				secureuri:false,//一般设置为false
				type:'post',
				data:{'width':$("#width").val(),'height':$('#height').val()},
				fileElementId:'image',//文件上传空间的id属性  <input type="file" id="file" name="file" />
				dataType: 'JSON',//返回值类型 一般设置为json(大写)
				success: function (data, status){
					console.log(data);
				},
				error: function (data, status, e){
					alert(e);
				}
			})
		})
	})
	
</script>